import React, { useEffect, useState, useRef } from 'react';
import Taro, { useDidShow, pxTransform } from '@tarojs/taro'
import { View, Text } from '@tarojs/components';
import Router from '@/utils/router'

import './index.scss';

const OrganizationEmpty = (props) => {
    const { Tool, title, hasTitle = true } = props
    const [userInfo, setUserInfo] = useState({})
    const { organizationId } = userInfo
    const menuButtonInfo = Taro.getMenuButtonBoundingClientRect()
    const paddingTop = (menuButtonInfo.top * 2)
    const height = menuButtonInfo.height * 2
    const drawertop = paddingTop + height + 8
    useDidShow(() => {
        setUserInfo(Taro.getStorageSync('userInfo'))
    })
    const handleMethod = (...args) => {
        setUserInfo(args[0])
    }
    useEffect(() => {
        Taro.eventCenter.on('callMethod', handleMethod)
    }, [])
    if (!organizationId) {
        return <View onClick={() => Router('selectOrganization')} style={{ width: '100%', height: '100vh', background: '#ffffff' }} className='commodity_box'>
            <View className='TitlePage_box' style={{
                padding: '14px', color: '#333333', fontSize: '14px',
                paddingTop: hasTitle ? pxTransform(paddingTop + height + 24) : '',
            }}>   {title}<Text style={{ color: '#1472ff', paddingLeft: '12px' }}>选择机构</Text></View>
        </View>
    }
    else {
        return <Tool organizationId={organizationId}></Tool>
    }
}
export default OrganizationEmpty